<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<meta name="description" content="Neon Admin Panel" />
	<meta name="author" content="" />
	
	<title>Neon | What's New</title>
	

	<link rel="stylesheet" href="assets/js/jquery-ui/css/no-theme/jquery-ui-1.10.3.custom.min.css">
	<link rel="stylesheet" href="assets/css/font-icons/entypo/css/entypo.css">
	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Noto+Sans:400,700,400italic">
	<link rel="stylesheet" href="assets/css/bootstrap.css">
	<link rel="stylesheet" href="assets/css/neon-core.css">
	<link rel="stylesheet" href="assets/css/neon-theme.css">
	<link rel="stylesheet" href="assets/css/neon-forms.css">
	<link rel="stylesheet" href="assets/css/custom.css">

	<script src="assets/js/jquery-1.11.0.min.js"></script>

	<!--[if lt IE 9]><script src="assets/js/ie8-responsive-file-warning.js"></script><![endif]-->

	<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
	<!--[if lt IE 9]>
		<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
		<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
	<![endif]-->
	
	
</head>
<body class="page-body  page-fade-only" data-url="http://neon.dev">

<div class="page-container"><!-- add class "sidebar-collapsed" to close sidebar by default, "chat-visible" to make chat appear always -->	
	
	<div class="sidebar-menu">
		
			
		<header class="logo-env">
			
			<!-- logo -->
			<div class="logo">
				<a href="index.html">
					<img src="assets/images/logo@2x.png" width="120" alt="" />
				</a>
			</div>
			
						<!-- logo collapse icon -->
						
			<div class="sidebar-collapse">
				<a href="#" class="sidebar-collapse-icon with-animation"><!-- add class "with-animation" if you want sidebar to have animation during expanding/collapsing transition -->
					<i class="entypo-menu"></i>
				</a>
			</div>
			
									
			
			<!-- open/close menu icon (do not remove if you want to enable menu on mobile devices) -->
			<div class="sidebar-mobile-menu visible-xs">
				<a href="#" class="with-animation"><!-- add class "with-animation" to support animation -->
					<i class="entypo-menu"></i>
				</a>
			</div>
			
		</header>
				
		
		
				
		
				
		<ul id="main-menu" class="">
			<!-- add class "multiple-expanded" to allow multiple submenus to open -->
			<!-- class "auto-inherit-active-class" will automatically add "active" class for parent elements who are marked already with class "active" -->
			<!-- Search Bar -->
			<li id="search">
				<form method="get" action="">
					<input type="text" name="q" class="search-input" placeholder="Search something..."/>
					<button type="submit">
						<i class="entypo-search"></i>
					</button>
				</form>
			</li>
			<li class="opened active">
				<a href="index.html">
					<i class="entypo-gauge"></i>
					<span>Dashboard</span>
				</a>
				<ul>
					<li>
						<a href="index.html">
							<span>Dashboard 1</span>
						</a>
					</li>
					<li>
						<a href="dashboard-2.html">
							<span>Dashboard 2</span>
						</a>
					</li>
					<li>
						<a href="dashboard-3.html">
							<span>Dashboard 3</span>
						</a>
					</li>
					<li>
						<a href="skin-black.html">
							<span>Skins</span>
						</a>
						<ul>
							<li>
								<a href="skin-black.html">
									<span>Black Skin</span>
								</a>
							</li>
							<li>
								<a href="skin-white.html">
									<span>White Skin</span>
								</a>
							</li>
							<li>
								<a href="skin-purple.html">
									<span>Purple Skin</span>
								</a>
							</li>
							<li>
								<a href="skin-cafe.html">
									<span>Cafe Skin</span>
								</a>
							</li>
							<li>
								<a href="skin-red.html">
									<span>Red Skin</span>
								</a>
							</li>
							<li>
								<a href="skin-green.html">
									<span>Green Skin</span>
								</a>
							</li>
							<li>
								<a href="skin-yellow.html">
									<span>Yellow Skin</span>
								</a>
							</li>
							<li>
								<a href="skin-blue.html">
									<span>Blue Skin</span>
								</a>
							</li>
						</ul>
					</li>
					<li class="active">
						<a href="highlights.html">
							<span>What's New</span>
							<span class="badge badge-success badge-roundless">v1.7</span>
						</a>
					</li>
				</ul>
			</li>
			<li>
				<a href="layout-api.html">
					<i class="entypo-layout"></i>
					<span>Layouts</span>
				</a>
				<ul>
					<li>
						<a href="layout-api.html">
							<span>Layout API</span>
						</a>
					</li>
					<li>
						<a href="layout-collapsed-sidebar.html">
							<span>Collapsed Sidebar</span>
						</a>
					</li>
					<li>
						<a href="layout-fixed-sidebar.html">
							<span>Fixed Sidebar</span>
						</a>
					</li>
					<li>
						<a href="layout-chat-open.html">
							<span>Chat Open</span>
						</a>
					</li>
					<li>
						<a href="layout-horizontal-menu-boxed.html">
							<span>Horizontal Menu Boxed</span>
						</a>
					</li>
					<li>
						<a href="layout-horizontal-menu-fluid.html">
							<span>Horizontal Menu Fluid</span>
						</a>
					</li>
					<li>
						<a href="layout-mixed-menus.html">
							<span>Mixed Menus</span>
						</a>
					</li>
					<li>
						<a href="layout-right-sidebar.html">
							<span>Right Sidebar</span>
						</a>
					</li>
					<li>
						<a href="layout-both-menus-right-sidebar.html">
							<span>Both Menus (Right Sidebar)</span>
						</a>
					</li>
					<li>
						<a href="layout-page-transition-fade.html">
							<span>Page Enter Transitions</span>
						</a>
						<ul>
							<li>
								<a href="layout-page-transition-fade.html">
									<span>Fade Scale</span>
								</a>
							</li>
							<li>
								<a href="layout-page-transition-left-in.html">
									<span>Left In</span>
								</a>
							</li>
							<li>
								<a href="layout-page-transition-right-in.html">
									<span>Right In</span>
								</a>
							</li>
							<li>
								<a href="layout-page-transition-fade-only.html">
									<span>Fade Only</span>
								</a>
							</li>
						</ul>
					</li>
					<li>
						<a href="layout-boxed.html">
							<span>Boxed Layout</span>
							<span class="badge badge-secondary badge-roundless">New</span>
						</a>
					</li>
				</ul>
			</li>
			<li>
				<a href="index.html" target="_blank">
					<i class="entypo-monitor"></i>
					<span>Frontend</span>
				</a>
			</li>
			<li>
				<a href="ui-panels.html">
					<i class="entypo-newspaper"></i>
					<span>UI Elements</span>
				</a>
				<ul>
					<li>
						<a href="ui-panels.html">
							<span>Panels</span>
						</a>
					</li>
					<li>
						<a href="ui-tiles.html">
							<span>Tiles</span>
						</a>
					</li>
					<li>
						<a href="forms-buttons.html">
							<span>Buttons</span>
						</a>
					</li>
					<li>
						<a href="ui-typography.html">
							<span>Typography</span>
						</a>
					</li>
					<li>
						<a href="ui-tabs-accordions.html">
							<span>Tabs &amp; Accordions</span>
						</a>
					</li>
					<li>
						<a href="ui-tooltips-popovers.html">
							<span>Tooltips &amp; Popovers</span>
						</a>
					</li>
					<li>
						<a href="ui-navbars.html">
							<span>Navbars</span>
						</a>
					</li>
					<li>
						<a href="ui-breadcrumbs.html">
							<span>Breadcrumbs</span>
						</a>
					</li>
					<li>
						<a href="ui-badges-labels.html">
							<span>Badges &amp; Labels</span>
						</a>
					</li>
					<li>
						<a href="ui-progress-bars.html">
							<span>Progress Bars</span>
						</a>
					</li>
					<li>
						<a href="ui-modals.html">
							<span>Modals</span>
						</a>
					</li>
					<li>
						<a href="ui-blockquotes.html">
							<span>Blockquotes</span>
						</a>
					</li>
					<li>
						<a href="ui-alerts.html">
							<span>Alerts</span>
						</a>
					</li>
					<li>
						<a href="ui-pagination.html">
							<span>Pagination</span>
						</a>
					</li>
				</ul>
			</li>
			<li>
				<a href="mailbox.html">
					<i class="entypo-mail"></i>
					<span>Mailbox</span>
					<span class="badge badge-secondary">8</span>
				</a>
				<ul>
					<li>
						<a href="mailbox.html">
							<i class="entypo-inbox"></i>
							<span>Inbox</span>
						</a>
					</li>
					<li>
						<a href="mailbox-compose.html">
							<i class="entypo-pencil"></i>
							<span>Compose Message</span>
						</a>
					</li>
					<li>
						<a href="mailbox-message.html">
							<i class="entypo-attach"></i>
							<span>View Message</span>
						</a>
					</li>
				</ul>
			</li>
			<li>
				<a href="forms-main.html">
					<i class="entypo-doc-text"></i>
					<span>Forms</span>
				</a>
				<ul>
					<li>
						<a href="forms-main.html">
							<span>Basic Elements</span>
						</a>
					</li>
					<li>
						<a href="forms-advanced.html">
							<span>Advanced Plugins</span>
						</a>
					</li>
					<li>
						<a href="forms-wizard.html">
							<span>Form Wizard</span>
						</a>
					</li>
					<li>
						<a href="forms-validation.html">
							<span>Data Validation</span>
						</a>
					</li>
					<li>
						<a href="forms-masks.html">
							<span>Input Masks</span>
						</a>
					</li>
					<li>
						<a href="forms-sliders.html">
							<span>Sliders</span>
						</a>
					</li>
					<li>
						<a href="forms-file-upload.html">
							<span>File Upload</span>
						</a>
					</li>
					<li>
						<a href="forms-wysiwyg.html">
							<span>Editors</span>
						</a>
					</li>
				</ul>
			</li>
			<li>
				<a href="tables-main.html">
					<i class="entypo-window"></i>
					<span>Tables</span>
				</a>
				<ul>
					<li>
						<a href="tables-main.html">
							<span>Basic Tables</span>
						</a>
					</li>
					<li>
						<a href="tables-datatable.html">
							<span>Data Tables</span>
						</a>
					</li>
				</ul>
			</li>
			<li>
				<a href="extra-icons.html">
					<i class="entypo-bag"></i>
					<span>Extra</span>
					<span class="badge badge-info badge-roundless">New Items</span>
				</a>
				<ul>
					<li>
						<a href="extra-icons.html">
							<span>Icons</span>
							<span class="badge badge-success">3</span>
						</a>
						<ul>
							<li>
								<a href="extra-icons.html">
									<span>Font Awesome</span>
								</a>
							</li>
							<li>
								<a href="extra-icons-entypo.html">
									<span>Entypo</span>
								</a>
							</li>
							<li>
								<a href="extra-icons-glyphicons.html">
									<span>Glyph Icons</span>
								</a>
							</li>
						</ul>
					</li>
					<li>
						<a href="extra-portlets.html">
							<span>Portlets</span>
						</a>
					</li>
					<li>
						<a href="extra-google-maps.html">
							<span>Maps</span>
						</a>
						<ul>
							<li>
								<a href="extra-google-maps.html">
									<span>Google Maps</span>
								</a>
							</li>
							<li>
								<a href="extra-vector-maps.html">
									<span>Vector Maps</span>
								</a>
							</li>
						</ul>
					</li>
					<li>
						<a href="extra-chat-api.html">
							<span>Chat API</span>
						</a>
					</li>
					<li>
						<a href="extra-calendar.html">
							<span>Calendar</span>
						</a>
					</li>
					<li>
						<a href="extra-notes.html">
							<span>Notes</span>
						</a>
					</li>
					<li>
						<a href="extra-lockscreen.html">
							<span>Lockscreen</span>
						</a>
					</li>
					<li>
						<a href="extra-login.html">
							<span>Login</span>
						</a>
					</li>
					<li>
						<a href="extra-register.html">
							<span>Register</span>
						</a>
					</li>
					<li>
						<a href="extra-invoice.html">
							<span>Invoice</span>
						</a>
					</li>
					<li>
						<a href="extra-members.html">
							<span>Members</span>
							<span class="badge badge-secondary badge-roundless">New</span>
						</a>
					</li>
					<li>
						<a href="extra-gallery.html">
							<span>Gallery</span>
						</a>
						<ul>
							<li>
								<a href="extra-gallery.html">
									<span>Albums</span>
								</a>
							</li>
							<li>
								<a href="extra-gallery-single.html">
									<span>Single Album</span>
								</a>
							</li>
						</ul>
					</li>
					<li>
						<a href="extra-profile.html">
							<span>Profile</span>
						</a>
					</li>
					<li>
						<a href="extra-404.html">
							<span>404 Page</span>
						</a>
					</li>
					<li>
						<a href="extra-blank-page.html">
							<span>Blank Page</span>
						</a>
					</li>
					<li>
						<a href="extra-timeline.html">
							<span>Timeline</span>
						</a>
					</li>
					<li>
						<a href="extra-comments.html">
							<span>Comments</span>
							<span class="badge badge-secondary badge-roundless">New</span>
						</a>
					</li>
					<li>
						<a href="extra-timeline-centered.html">
							<span>Timeline Centered</span>
						</a>
					</li>
					<li>
						<a href="extra-tocify.html">
							<span>Tocify</span>
						</a>
					</li>
					<li>
						<a href="ui-notifications.html">
							<span>Notifications</span>
						</a>
					</li>
					<li>
						<a href="extra-new-post.html">
							<span>New Post</span>
							<span class="badge badge-secondary badge-roundless">New</span>
						</a>
					</li>
					<li>
						<a href="extra-settings.html">
							<span>Settings</span>
							<span class="badge badge-secondary badge-roundless">New</span>
						</a>
					</li>
					<li>
						<a href="extra-scrollbox.html">
							<span>Scrollbox</span>
						</a>
					</li>
					<li>
						<a href="extra-image-crop.html">
							<span>Image Crop</span>
						</a>
					</li>
					<li>
						<a href="extra-search.html">
							<span>Search Page</span>
						</a>
					</li>
					<li>
						<a href="extra-language-selector.html">
							<span>Language Selector</span>
						</a>
					</li>
					<li>
						<a href="extra-nestable.html">
							<span>Nestable Lists</span>
							<span class="badge badge-secondary badge-roundless">New</span>
						</a>
					</li>
					<li>
						<a href="extra-file-tree.html">
							<span>File Tree</span>
							<span class="badge badge-secondary badge-roundless">New</span>
						</a>
					</li>
					<li>
						<a href="extra-load-progress.html">
							<span>Load Progress</span>
							<span class="badge badge-secondary badge-roundless">New</span>
						</a>
					</li>
				</ul>
			</li>
			<li>
				<a href="charts.html">
					<i class="entypo-chart-bar"></i>
					<span>Charts</span>
				</a>
			</li>
			<li>
				<a href="#">
					<i class="entypo-flow-tree"></i>
					<span>Menu Levels</span>
				</a>
				<ul>
					<li>
						<a href="#">
							<i class="entypo-flow-line"></i>
							<span>Menu Level 1.1</span>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="entypo-flow-line"></i>
							<span>Menu Level 1.2</span>
						</a>
					</li>
					<li>
						<a href="#">
							<i class="entypo-flow-line"></i>
							<span>Menu Level 1.3</span>
						</a>
						<ul>
							<li>
								<a href="#">
									<i class="entypo-flow-parallel"></i>
									<span>Menu Level 2.1</span>
								</a>
							</li>
							<li>
								<a href="#">
									<i class="entypo-flow-parallel"></i>
									<span>Menu Level 2.2</span>
								</a>
								<ul>
									<li>
										<a href="#">
											<i class="entypo-flow-cascade"></i>
											<span>Menu Level 3.1</span>
										</a>
										<ul>
											<li>
												<a href="#">
													<i class="entypo-flow-branch"></i>
													<span>Menu Level 4.1</span>
												</a>
											</li>
										</ul>
									</li>
									<li>
										<a href="#">
											<i class="entypo-flow-cascade"></i>
											<span>Menu Level 3.2</span>
										</a>
									</li>
								</ul>
							</li>
							<li>
								<a href="#">
									<i class="entypo-flow-parallel"></i>
									<span>Menu Level 2.3</span>
								</a>
							</li>
						</ul>
					</li>
				</ul>
			</li>
		</ul>
				
	</div>	
	<div class="main-content">
		
<div class="row">
	
	<!-- Profile Info and Notifications -->
	<div class="col-md-6 col-sm-8 clearfix">
		
		<ul class="user-info pull-left pull-none-xsm">
		
						<!-- Profile Info -->
			<li class="profile-info dropdown"><!-- add class "pull-right" if you want to place this from right -->
				
				<a href="#" class="dropdown-toggle" data-toggle="dropdown">
					<img src="assets/images/thumb-1@2x.png" alt="" class="img-circle" width="44" />
					Art Ramadani
				</a>
				
				<ul class="dropdown-menu">
					
					<!-- Reverse Caret -->
					<li class="caret"></li>
					
					<!-- Profile sub-links -->
					<li>
						<a href="extra-timeline.html">
							<i class="entypo-user"></i>
							Edit Profile
						</a>
					</li>
					
					<li>
						<a href="mailbox.html">
							<i class="entypo-mail"></i>
							Inbox
						</a>
					</li>
					
					<li>
						<a href="extra-calendar.html">
							<i class="entypo-calendar"></i>
							Calendar
						</a>
					</li>
					
					<li>
						<a href="#">
							<i class="entypo-clipboard"></i>
							Tasks
						</a>
					</li>
				</ul>
			</li>
		
		</ul>
				
		<ul class="user-info pull-left pull-right-xs pull-none-xsm">
			
			<!-- Raw Notifications -->
			<li class="notifications dropdown">
				
				<a href="#" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
					<i class="entypo-attention"></i>
					<span class="badge badge-info">6</span>
				</a>
				
				<ul class="dropdown-menu">
					<li class="top">
	<p class="small">
		<a href="#" class="pull-right">Mark all Read</a>
		You have <strong>3</strong> new notifications.
	</p>
</li>

<li>
	<ul class="dropdown-menu-list scroller">
		<li class="unread notification-success">
			<a href="#">
				<i class="entypo-user-add pull-right"></i>
				
				<span class="line">
					<strong>New user registered</strong>
				</span>
				
				<span class="line small">
					30 seconds ago
				</span>
			</a>
		</li>
		
		<li class="unread notification-secondary">
			<a href="#">
				<i class="entypo-heart pull-right"></i>
				
				<span class="line">
					<strong>Someone special liked this</strong>
				</span>
				
				<span class="line small">
					2 minutes ago
				</span>
			</a>
		</li>
		
		<li class="notification-primary">
			<a href="#">
				<i class="entypo-user pull-right"></i>
				
				<span class="line">
					<strong>Privacy settings have been changed</strong>
				</span>
				
				<span class="line small">
					3 hours ago
				</span>
			</a>
		</li>
		
		<li class="notification-danger">
			<a href="#">
				<i class="entypo-cancel-circled pull-right"></i>
				
				<span class="line">
					John cancelled the event
				</span>
				
				<span class="line small">
					9 hours ago
				</span>
			</a>
		</li>
		
		<li class="notification-info">
			<a href="#">
				<i class="entypo-info pull-right"></i>
				
				<span class="line">
					The server is status is stable
				</span>
				
				<span class="line small">
					yesterday at 10:30am
				</span>
			</a>
		</li>
		
		<li class="notification-warning">
			<a href="#">
				<i class="entypo-rss pull-right"></i>
				
				<span class="line">
					New comments waiting approval
				</span>
				
				<span class="line small">
					last week
				</span>
			</a>
		</li>
	</ul>
</li>

<li class="external">
	<a href="#">View all notifications</a>
</li>				</ul>
				
			</li>
			
			<!-- Message Notifications -->
			<li class="notifications dropdown">
				
				<a href="#" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
					<i class="entypo-mail"></i>
					<span class="badge badge-secondary">10</span>
				</a>
				
				<ul class="dropdown-menu">
					<li>
	<ul class="dropdown-menu-list scroller">
		<li class="active">
			<a href="#">
				<span class="image pull-right">
					<img src="assets/images/thumb-1.png" alt="" class="img-circle" />
				</span>
				
				<span class="line">
					<strong>Luc Chartier</strong>
					- yesterday
				</span>
				
				<span class="line desc small">
					This ain’t our first item, it is the best of the rest.
				</span>
			</a>
		</li>
		
		<li class="active">
			<a href="#">
				<span class="image pull-right">
					<img src="assets/images/thumb-2.png" alt="" class="img-circle" />
				</span>
				
				<span class="line">
					<strong>Salma Nyberg</strong>
					- 2 days ago
				</span>
				
				<span class="line desc small">
					Oh he decisively impression attachment friendship so if everything. 
				</span>
			</a>
		</li>
		
		<li>
			<a href="#">
				<span class="image pull-right">
					<img src="assets/images/thumb-3.png" alt="" class="img-circle" />
				</span>
				
				<span class="line">
					Hayden Cartwright
					- a week ago
				</span>
				
				<span class="line desc small">
					Whose her enjoy chief new young. Felicity if ye required likewise so doubtful.
				</span>
			</a>
		</li>
		
		<li>
			<a href="#">
				<span class="image pull-right">
					<img src="assets/images/thumb-4.png" alt="" class="img-circle" />
				</span>
				
				<span class="line">
					Sandra Eberhardt
					- 16 days ago
				</span>
				
				<span class="line desc small">
					On so attention necessary at by provision otherwise existence direction.
				</span>
			</a>
		</li>
	</ul>
</li>

<li class="external">
	<a href="mailbox.html">All Messages</a>
</li>				</ul>
				
			</li>
			
			<!-- Task Notifications -->
			<li class="notifications dropdown">
				
				<a href="#" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
					<i class="entypo-list"></i>
					<span class="badge badge-warning">1</span>
				</a>
				
				<ul class="dropdown-menu">
					<li class="top">
	<p>You have 6 pending tasks</p>
</li>

<li>
	<ul class="dropdown-menu-list scroller">
		<li>
			<a href="#">
				<span class="task">
					<span class="desc">Procurement</span>
					<span class="percent">27%</span>
				</span>
			
				<span class="progress">
					<span style="width: 27%;" class="progress-bar progress-bar-success">
						<span class="sr-only">27% Complete</span>
					</span>
				</span>
			</a>
		</li>
		<li>
			<a href="#">
				<span class="task">
					<span class="desc">App Development</span>
					<span class="percent">83%</span>
				</span>
				
				<span class="progress progress-striped">
					<span style="width: 83%;" class="progress-bar progress-bar-danger">
						<span class="sr-only">83% Complete</span>
					</span>
				</span>
			</a>
		</li>
		<li>
			<a href="#">
				<span class="task">
					<span class="desc">HTML Slicing</span>
					<span class="percent">91%</span>
				</span>
				
				<span class="progress">
					<span style="width: 91%;" class="progress-bar progress-bar-success">
						<span class="sr-only">91% Complete</span>
					</span>
				</span>
			</a>
		</li>
		<li>
			<a href="#">
				<span class="task">
					<span class="desc">Database Repair</span>
					<span class="percent">12%</span>
				</span>
				
				<span class="progress progress-striped">
					<span style="width: 12%;" class="progress-bar progress-bar-warning">
						<span class="sr-only">12% Complete</span>
					</span>
				</span>
			</a>
		</li>
		<li>
			<a href="#">
				<span class="task">
					<span class="desc">Backup Create Progress</span>
					<span class="percent">54%</span>
				</span>
				
				<span class="progress progress-striped">
					<span style="width: 54%;" class="progress-bar progress-bar-info">
						<span class="sr-only">54% Complete</span>
					</span>
				</span>
			</a>
		</li>
		<li>
			<a href="#">
				<span class="task">
					<span class="desc">Upgrade Progress</span>
					<span class="percent">17%</span>
				</span>
				
				<span class="progress progress-striped">
					<span style="width: 17%;" class="progress-bar progress-bar-important">
						<span class="sr-only">17% Complete</span>
					</span>
				</span>
			</a>
		</li>
	</ul>
</li>

<li class="external">
	<a href="#">See all tasks</a>
</li>				</ul>
				
			</li>
		
		</ul>
	
	</div>
	
	
	<!-- Raw Links -->
	<div class="col-md-6 col-sm-4 clearfix hidden-xs">
		
		<ul class="list-inline links-list pull-right">
			
			<!-- Language Selector -->			<li class="dropdown language-selector">
				
				Language: &nbsp;
				<a href="#" class="dropdown-toggle" data-toggle="dropdown" data-close-others="true">
					<img src="assets/images/flag-uk.png" />
				</a>
				
				<ul class="dropdown-menu pull-right">
					<li>
						<a href="#">
							<img src="assets/images/flag-de.png" />
							<span>Deutsch</span>
						</a>
					</li>
					<li class="active">
						<a href="#">
							<img src="assets/images/flag-uk.png" />
							<span>English</span>
						</a>
					</li>
					<li>
						<a href="#">
							<img src="assets/images/flag-fr.png" />
							<span>François</span>
						</a>
					</li>
					<li>
						<a href="#">
							<img src="assets/images/flag-al.png" />
							<span>Shqip</span>
						</a>
					</li>
					<li>
						<a href="#">
							<img src="assets/images/flag-es.png" />
							<span>Español</span>
						</a>
					</li>
				</ul>
				
			</li>
			
			<li class="sep"></li>
			
						
			<li>
				<a href="#" data-toggle="chat" data-animate="1" data-collapse-sidebar="1">
					<i class="entypo-chat"></i>
					Chat
					
					<span class="badge badge-success chat-notifications-badge is-hidden">0</span>
				</a>
			</li>
			
			<li class="sep"></li>
			
			<li>
				<a href="extra-login.html">
					Log Out <i class="entypo-logout right"></i>
				</a>
			</li>
		</ul>
		
	</div>
	
</div>

<hr />
			<ol class="breadcrumb bc-3">
						<li>
				<a href="index.html"><i class="entypo-home"></i>Home</a>
			</li>
					<li>
			
							<a href="index.html">Dashboard</a>
					</li>
				<li class="active">
			
							<strong>What's New</strong>
					</li>
					</ol>
			
<div class="jumbotron">
	<h1>What's new?</h1>
	
	<p>Here you will find the highlights about latest version of <strong>Neon</strong> theme. Learn more by scrolling down on this page. <strong>Neon</strong> contains a total number of <strong>107</strong> HTML files, 7 new HTML files are added in version 1.7 since 1.5.1.</p>
	
	<p>
		<br />
		<div class="btn btn-primary btn-lg">Current Version: <strong>v1.7</strong></div>
	</p>
</div>


<h2>
	<span class="label label-success">1.7</span> &nbsp; Version Highlights
</h2>

<ul class="version-highlights">
	
	<li>
		<div class="screenshot">
			<a href="layout-boxed.html">
				<img src="assets/images/highlights-4-1-boxed.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Boxed Layout</h3>
			<p>
				This version was released especially for boxed layout type. By just adding class "boxed-layout" to the body it will turn Neon to boxed mode. When you purchase neon, you will get Boxed layout files separately from the full width files.
				
				<a href="layout-boxed.html">Try it out, click here.</a>
			</p>
		</div>
	</li>
	
	
	<li>
		<div class="screenshot">
			<a href="extra-comments.html">
				<img src="assets/images/highlights-3-1-comments.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Comments Page</h3>
			<p>
				This type of page provides UI for the commenting system in back-end. It has search, pagination, filter and edit comment form in modal. See the <a href="extra-comments.html">comments dashboard here</a>.
			</p>
		</div>
	</li>
	
	
	<li>
		<div class="screenshot">
			<a href="extra-members.html">
				<img src="assets/images/highlights-3-2-members.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Members Page</h3>
			<p>
				Good looking and organized way to show your members list with image thumbnail, name and other relevant user links. See the <a href="extra-members.html">members page here</a>.
			</p>
		</div>
	</li>
	
	
	<li>
		<div class="screenshot">
			<a href="extra-load-progress.html">
				<img src="assets/images/highlights-3-4-page-loading.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Page Loading Bar</h3>
			<p>
				Progress bar that indicates something is loading in the page, with full API implemented and can be used anywhere in the theme that is easy to call the JavaScript function. <a href="extra-load-progress.html">Show how it works</a>.
			</p>
		</div>
	</li>
	
	
	<li>
		<div class="screenshot">
			<a href="extra-new-post.html">
				<img src="assets/images/highlights-3-2-newpost.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>New Post Page</h3>
			<p>
				Using already existing components we have composed an example page with UI components and created &quot;add post&quot; page. See the <a href="extra-new-post.html">add new post page here</a>.
			</p>
		</div>
	</li>
	
	
	<li>
		<div class="screenshot">
			<a href="extra-settings.html">
				<img src="assets/images/highlights-3-5-settings-page.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Settings Page</h3>
			<p>
				Just like the &quot;New Post Page&quot; this is another example that combines components of Neon and shows you how to create the Settings page. See the <a href="extra-settings.html">settings page here</a>.
			</p>
		</div>
	</li>
	
	
	<li>
		<div class="screenshot">
			<a href="extra-file-tree.html">
				<img src="assets/images/highlights-3-6-treeview.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Tree View</h3>
			<p>
				Parsing directory files in an easy way from your server is now available in this version of Neon, it uses PHP to retrieve the list of directories and files. To make it easier for you, we have included an example how you can retrieve directory list infos in "Event logger" field. <a href="extra-file-tree.html">See it in action</a>.
			</p>
		</div>
	</li>
	
	
	<li>
		<div class="screenshot">
			<a href="extra-nestable.html">
				<img src="assets/images/highlights-3-3-nestable.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Nestable List</h3>
			<p>
				This plugin gives you the ability to create lists that are managed by drag and drop, it can be used especially for menu management. See how it works <a href="extra-nestable.html">here</a>.
			</p>
		</div>
	</li>

</ul>

<br />
<br />


<h2>
	<span class="label label-warning">1.5</span> &nbsp; Version Highlights
</h2>

<ul class="version-highlights">
	
	<li>
		<div class="screenshot">
			<a href="highlights.html">
				<img src="assets/images/highlights-2-0-bootstrap.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Upgraded to Bootstrap 3.1</h3>
			<p>
				We love to keep up with latest updates. Neon is now <strong>Bootstrap 3.1</strong> compatible!
			</p>
		</div>
	</li>
	
	
	<li>
		<div class="screenshot">
			<a href="index.html">
				<img src="assets/images/highlights-3-front-end.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Frontend Version</h3>
			<p>
				Now you can use Neon also on application front-end with variety of features and pages. In this version, we have created 8 front-end pages and more to come in newest version.
			</p>
		</div>
	</li>
	
	<li>
		<div class="screenshot">
			<a href="index.html?rtl">
				<img src="assets/images/highlights-2-10-rtl-support.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>RTL Support</h3>
			<p>
				We have good news for our fellows whose primary concern is language direction, Neon now supports full "right-to-left" language direction.
			</p>
		</div>
	</li>
	
	<li>
		<div class="screenshot">
			<a href="layout-right-sidebar.html">
				<img src="assets/images/highlights-2-5-right-menu.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Right Sidebar</h3>
			<p>
				By just adding <code>right-sidebar</code> class to <code>page-container</code> element you can align sidebar menu to right side. It is also supported on pages with both menus and also in collapsed mode. <a href="layout-right-sidebar.html">See how it looks</a>!
			</p>
		</div>
	</li>
	
	<li>
		<div class="screenshot">
			<a href="layout-right-sidebar-chat.html">
				<img src="assets/images/highlights-2-7-left-chat.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Left Chat</h3>
			<p>
				If you are using <strong>Right Sidebar</strong>, the chat container will automatically turn to left side and chat conversation will flip from left to right when conversation is open. <a href="layout-right-sidebar-chat.html">See it live</a>!
			</p>
		</div>
	</li>
	
	
	
	<li>
		<div class="screenshot">
			<a href="dashboard-3.html">
				<img src="assets/images/highlights-3-dashboard.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>New Dashboard Page</h3>
			<p>
				New composed page with statistics widgets, tables and panels. We introduce here the <strong>page background</strong> in this page. 
			</p>
		</div>
	</li>
	
	
	
	<li>
		<div class="screenshot">
			<a href="index.html">
				<img src="assets/images/highlights-3-photoshop.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Extra PSD Files Included</h3>
			<p>
				New 10 PSD files are included in this version, making total 12 PSD files. These 10 PSD files are Front-end Neon.
			</p>
		</div>
	</li>

</ul>

<br />
<br />


<h2>
	<span class="label label-warning">1.1.4</span> &nbsp; Version Highlights
</h2>

<ul class="version-highlights">
	
	<li>
		<div class="screenshot">
			<a href="extra-register.html">
				<img src="assets/images/highlights-2-4-register-form.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Register &amp; Forgot Password Form</h3>
			<p>
				Extra versions of <a href="extra-login.html">Login</a> page, so now you can use these new type of pages that include <a href="extra-forgot-password.html">reset password form</a> and <a href="extra-register.html">register form</a> with steps. They both have also implemented the <strong>PHP</strong> processing via <strong>AJAX</strong> using files inside <em>data/</em> directory.
			</p>
		</div>
	</li>
	
	<li>
		<div class="screenshot">
			<a href="extra-login.html">
				<img src="assets/images/highlights-2-6-login-form.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Login Form with Validation &amp; Social Connect Buttons</h3>
			<p>
				As requested by lot of users we have improved our current login page and added the login validation to it. Also there you can include most popular Social Network connect buttons such as <strong>Facebook</strong>, <strong>Twitter</strong> and <strong>Google+</strong>.
			</p>
		</div>
	</li>
	
	<li>
		<div class="screenshot">
			<a href="forms-icheck.html">
				<img src="assets/images/highlights-2-1-icheck.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>iCheck - Customized Checkboxes and Radio Buttons</h3>
			<p>
				Except our current checkbox and radio replace plugin, now you have the alternative to choose between the native implemented Checkbox replacemend and iCheck, which is really nice and flexible plugin. <a href="forms-icheck.html">See the checkbox options &raquo;</a>
			</p>
		</div>
	</li>
	
	<li>
		<div class="screenshot">
			<a href="extra-search.html">
				<img src="assets/images/highlights-2-9-search-results.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Search Results</h3>
			<p>
				Search functionality of your site can use this <a href="extra-search.html">new page</a> dedicated to search and show results. Currently Neon supports two types of results displaying, <strong>title + content + link</strong> and <strong>table</strong> results.
			</p>
		</div>
	</li>
	
	<li>
		<div class="screenshot">
			<a href="extra-language-selector.html">
				<img src="assets/images/highlights-2-3-language-switcher.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Language Selector</h3>
			<p>
				If your site or application supports multilingual content, then you are able to use our language selector dropdown. Just include the implementation code (<a href="extra-language-selector.html">here</a>) to user-profile links in the header part of main content (more precisely inside <code>.user-info</code> element).
			</p>
		</div>
	</li>
	
	<li>
		<div class="screenshot">
			<a href="forms-advanced.html#spinners">
				<img src="assets/images/highlights-2-8-spinners.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Input Spinner</h3>
			<p>
				Range specified input spinner, available in variety of colors, options and sizes. The implementation code is fairly simple. See how they work here <a href="forms-advanced.html#spinners">Advanced Plugins</a>.
			</p>
		</div>
	</li>
	
	<li>
		<div class="screenshot">
			<a href="forms-wysiwyg.html">
				<img src="assets/images/highlights-2-2-new-editor.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Markdown Area</h3>
			<p>
				The Markdown area allows you to write in Markdown and HTML while it generates a real-time preview. It includes a toolbar that helps you to change text appearance and add links, pictures, blockquotes and lists without having to write code. <a href="forms-wysiwyg.html">Try it</a>!
			</p>
		</div>
	</li>

</ul>


<br />
<br />


<h2>
	<span class="label label-warning">1.1.3</span> &nbsp; Version Highlights
</h2>

<ul class="version-highlights">
	
	<li>
		<div class="screenshot">
			<a href="skin-black.html">
				<img src="assets/images/highlights-1-skins.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Skins</h3>
			<p>
				We have added the support for theme skins, now  you can use custom skin for your copy of <strong>Neon</strong> theme. As a start, we have included 8 new skins, which you can also try: 
				<a href="skin-blue.html"><strong>Blue</strong></a>,
				<a href="skin-red.html"><strong>Red</strong></a>,
				<a href="skin-green.html"><strong>Green</strong></a>,
				<a href="skin-purple.html"><strong>Purple</strong></a>,
				<a href="skin-yellow.html"><strong>Yellow</strong></a>,
				<a href="skin-cafe.html"><strong>Cafe</strong></a>,
				<a href="skin-black.html"><strong>Black</strong></a> and
				<a href="skin-white.html"><strong>White</strong></a>.
			</p>
		</div>
	</li>
	
	<li>
		<div class="screenshot">
			<a href="extra-profile.html">
				<img src="assets/images/highlights-2-profile.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Profile Page</h3>
			<p>A new modern way of displaying a profile info and user timeline inspired from most popular social networks. On this page you have profile header, profile tabs, status form, and three types of stories: <strong>status update</strong>, <strong>check in</strong> and <strong>photos</strong>.</p>
		</div>
	</li>
	
	<li>
		<div class="screenshot">
			<a href="extra-notes.html">
				<img src="assets/images/highlights-3-notes.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Notes</h3>
			<p>
				You can use this type of page to offer <strong>User Personal Notes</strong> functionality.
				It has built-in JavaScript interface which allows you to insert, edit and delete notes. See <strong>assets/js/neon-notes.js</strong> to learn more or extend the functionality of this page. 
			</p>
		</div>
	</li>
	
	<li>
		<div class="screenshot">
			<a href="tables-datatable.html">
				<img src="assets/images/highlights-4-datatables.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>DataTables</h3>
			<p>With the requests of our customers we have extended Data Tables by providing more examples with custom plugins, that will allow you to create advanced tables features such as: <strong>Column Filter</strong>, <strong>Data Exporting</strong> and <strong>Responsive Tables</strong>. We have also included basic responsive table on <a href="tables-main.html">this page</a> (the last table).</p>
		</div>
	</li>
		
	<li>
		<div class="screenshot">
			<a href="dashboard-2.html">
				<img src="assets/images/highlights-5-profile_left.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Sidebar User Thumbnail</h3>
			<p>
				Display user profile right below of sidebar logo image. This feature also supports pop-up links related to user profile which is accessible when user clicks on the user thumbnail or name. <a href="dashboard-2.html">See it in action &raquo;</a>
			</p>
		</div>
	</li>
	
	<li>
		<div class="screenshot">
			<a href="extra-timeline.html">
				<img src="assets/images/highlights-8-timeline.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Timelines</h3>
			<p>
				We have provided two types of Timelines on this update, <strong>vertical left aligned</strong> and <strong>vertical centered timeline</strong>. These are common types of timelines but they have different markup compared to each other. Try them: <a href="extra-timeline.html"><strong>Left Timeline</strong></a> and <a href="extra-timeline-centered.html"><strong>Centered Timeline</strong></a>.
			</p>
		</div>
	</li>
	
	<li>
		<div class="screenshot">
			<a href="extra-gallery.html">
				<img src="assets/images/highlights-7-gallery.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Gallery</h3>
			<p>
				New and complete gallery elements are now available on <strong>Neon</strong>. We have added <strong>Albums</strong> and <strong>Single album</strong> pages with <em>editing (cropping)</em>, <em>deleting</em>, <em>uploading</em> and <em>filtering</em> features. See them in action: <a href="extra-gallery.html"><strong>Albums</strong></a> and <a href="extra-gallery-single.html"><strong>Single Album</strong></a>.
			</p>
		</div>
	</li>
	
	<li>
		<div class="screenshot">
			<a href="extra-image-crop.html">
				<img src="assets/images/highlights-6-crop.png" />
			</a>
		</div>
		
		<div class="notes">
			<h3>Image Crop</h3>
			<p>
				Easily crop images with Jcrop plugin which offers lot of options for image manipulation (cropping). We have included four examples how it can be used: <strong>Simple Example</strong>, <strong>Event Handling</strong>, <strong>Thumbnail Generator</strong> and <strong>Live Crop (using PHP)</strong>.
			</p>
		</div>
	</li>
	
</ul>

<br />

<h2>Textual Changelog</h2>
<br />

<pre># Mar 28, 2014 v 1.7

* [Added] Boxed Layout support

* [Added] Members page (extra-members.html)
* [Added] Comments page (extra-comments.html)
* [Added] New post page (extra-new-post.html)
* [Added] Settings page (extra-settings.html)
* [Added] Nested list plugin (extra-nestable.html)
* [Added] File tree plugin (extra-file-tree.html)
* [Added] Progress indicator (extra-load-progress.html)
* [Added] New front-end mobile menu


# Mar 25, 2014 v 1.6

* [Added] Tabs in XS mode will display icons instead of text (ui-tabs-accordions.html)

* [Fix] Group tile with stats now its properly aligned, Firefox background tiles that are pushed little lower (ui-tiles.html)
* [Fix] When opening modals will not bounce the page content container (ui-modals.html)
* [Fix] (CSS) IE fixes
* [Fix] RTL logo on Navbar
* [Fix] Front-end carousel issue in Safari
* [Fix] $.noConflict() - Neon will no longer have issues with this declaration
* [Fix] (CSS) DataTable width when sidebar is collapsed/expanded
* [Fix] (CSS) DataTable Rows per page broken width
* [Fix] Modals not opening in firefox (ui-modals.html)

* [Added] Tabs will have icons in responsive (XS-mode, file: ui-tabs-accordions.html)


# Feb 13, 2014 v 1.5.1

* [Fix] Fixed CSS Issues
* [Fix] Data folder missing


# Feb 12, 2014 v 1.5.0

* [Added] Front-end Interface
* [Added] Neon is now upgraded to Bootstrap 3.1
* [Added] Full RTL Support
* [Added] Sidebar position on the right (+Chat left)
* [Added] CSS files are now separated into groups for to decrease load size
* [Added] 10 new PSD files
* [Added] New Dashboard Page (dashboard-3.html)

* [Fix] Firefox issues fixed


# Jan 31, 2014 v 1.1.4

* [Added] Register form page (extra-register.html)
* [Added] Forgot password form page (extra-forgot-password.html)
* [Added] Login form processing with PHP (extra-login.html and data/sample-login-form.php)
* [Added] Search Result page added (extra-search.html)
* [Added] UIKit Markdown editor (forms-wysiwyg.html)
* [Added] iCheck replacement for radio buttons and checkboxes (forms-icheck.html)
* [Added] Language select bar
* [Added] Input spinner (forms-advanced.html)
* [Added] Alternative Social networks login buttons on Login page (extra-login.html)

* [Fix] Time picker in popup not showing the time popup selector
* [Fix] Sidebar issue "Flash of unstyle content"
* [Fix] Fixed Sidebar page, collapsed sidebar menu hover don't work
* [Fix] Fixed lot of reported CSS incosistencies
* [Fix] Fixed collapsing effect with tables as panel body
* [Fix] Chat conversation, auto-close when collapsing chat container

* [Updated] jQuery updated to latest public version


# Jan 9, 2014 v 1.1.3

* [Added] Theme Skins are now supported! Available skins: Blue, Red, Green, Purple, Black, White, Yellow, Cafe
* [Added] DataTables examples: Filtering Columns, Data Exporting, Responsive Data Tables
* [Added] Image Crop plugin is now added - See extra-image-crop.html
* [Added] 3 PSD files are included in extra/ folder


# Jan 6, 2014 v 1.1.2

* [Added] Profile Page added (extra-profile.html)
* [Added] Timeline - vertical left aligned (extra-timeline.html)
* [Added] Responsive tables (tables-main.html)

* [Fix] Charts page will not render properly the profile notification tooltips.
* [Fix] Improved Retina Support for logos and images


# Jan 5, 2014 v 1.1.1

* [Added] Gallery Albums Page (extra-gallery.html)
* [Added] Gallery Album Single Page (extra-gallery-single.html)


# Jan 3, 2014 v 1.1.0

* [Added] User Info on Sidebar + Popup Menu
* [Added] Notes Page functionality added on extra-notes.html - You can save notes. Handle file assets/js/neon-notes.js

* [Fix] WYSIHTML5 editor - text colors now are applied properly. Attribute [data-stylesheet-url] solves this.
* [Fix] Sliders (forms-sliders.html) are now compatible with Touch Devices.


# Jan 1, 2014 v 1.0.2

* [Fix] Calendar Week and Day Agenda not styled properly


# Dec 20, 2013	V 1.0.1

* [Fix] Overall fixes and improvements
* [Fix] Fail-safe page transitions are added.
* [Added] Modals are now shown in better way (ui-modals.html)
* [Added] Dropzone now shows info for uploaded files (forms-file-upload.html)</pre><!-- Footer -->
<footer class="main">
	
		
	&copy; 2014 <strong>Neon</strong> Admin Theme by <a href="http://laborator.co" target="_blank">Laborator</a>
	
</footer>	</div>
	
	
<div id="chat" class="fixed" data-current-user="Art Ramadani" data-order-by-status="1" data-max-chat-history="25">
	
	<div class="chat-inner">
	
		
		<h2 class="chat-header">
			<a href="#" class="chat-close" data-animate="1"><i class="entypo-cancel"></i></a>
			
			<i class="entypo-users"></i>
			Chat
			<span class="badge badge-success is-hidden">0</span>
		</h2>
		
		
		<div class="chat-group" id="group-1">
			<strong>Favorites</strong>
			
			<a href="#" id="sample-user-123" data-conversation-history="#sample_history"><span class="user-status is-online"></span> <em>Catherine J. Watkins</em></a>
			<a href="#"><span class="user-status is-online"></span> <em>Nicholas R. Walker</em></a>
			<a href="#"><span class="user-status is-busy"></span> <em>Susan J. Best</em></a>
			<a href="#"><span class="user-status is-offline"></span> <em>Brandon S. Young</em></a>
			<a href="#"><span class="user-status is-idle"></span> <em>Fernando G. Olson</em></a>
		</div>
		
		
		<div class="chat-group" id="group-2">
			<strong>Work</strong>
			
			<a href="#"><span class="user-status is-offline"></span> <em>Robert J. Garcia</em></a>
			<a href="#" data-conversation-history="#sample_history_2"><span class="user-status is-offline"></span> <em>Daniel A. Pena</em></a>
			<a href="#"><span class="user-status is-busy"></span> <em>Rodrigo E. Lozano</em></a>
		</div>
		
		
		<div class="chat-group" id="group-3">
			<strong>Social</strong>
			
			<a href="#"><span class="user-status is-busy"></span> <em>Velma G. Pearson</em></a>
			<a href="#"><span class="user-status is-offline"></span> <em>Margaret R. Dedmon</em></a>
			<a href="#"><span class="user-status is-online"></span> <em>Kathleen M. Canales</em></a>
			<a href="#"><span class="user-status is-offline"></span> <em>Tracy J. Rodriguez</em></a>
		</div>
	
	</div>
	
	<!-- conversation template -->
	<div class="chat-conversation">
		
		<div class="conversation-header">
			<a href="#" class="conversation-close"><i class="entypo-cancel"></i></a>
			
			<span class="user-status"></span>
			<span class="display-name"></span> 
			<small></small>
		</div>
		
		<ul class="conversation-body">	
		</ul>
		
		<div class="chat-textarea">
			<textarea class="form-control autogrow" placeholder="Type your message"></textarea>
		</div>
		
	</div>
	
</div>


<!-- Chat Histories -->
<ul class="chat-history" id="sample_history">
	<li>
		<span class="user">Art Ramadani</span>
		<p>Are you here?</p>
		<span class="time">09:00</span>
	</li>
	
	<li class="opponent">
		<span class="user">Catherine J. Watkins</span>
		<p>This message is pre-queued.</p>
		<span class="time">09:25</span>
	</li>
	
	<li class="opponent">
		<span class="user">Catherine J. Watkins</span>
		<p>Whohoo!</p>
		<span class="time">09:26</span>
	</li>
	
	<li class="opponent unread">
		<span class="user">Catherine J. Watkins</span>
		<p>Do you like it?</p>
		<span class="time">09:27</span>
	</li>
</ul>




<!-- Chat Histories -->
<ul class="chat-history" id="sample_history_2">
	<li class="opponent unread">
		<span class="user">Daniel A. Pena</span>
		<p>I am going out.</p>
		<span class="time">08:21</span>
	</li>
	
	<li class="opponent unread">
		<span class="user">Daniel A. Pena</span>
		<p>Call me when you see this message.</p>
		<span class="time">08:27</span>
	</li>
</ul>	
	</div>




	<!-- Bottom Scripts -->
	<script src="assets/js/gsap/main-gsap.js"></script>
	<script src="assets/js/jquery-ui/js/jquery-ui-1.10.3.minimal.min.js"></script>
	<script src="assets/js/bootstrap.js"></script>
	<script src="assets/js/joinable.js"></script>
	<script src="assets/js/resizeable.js"></script>
	<script src="assets/js/neon-api.js"></script>
	<script src="assets/js/neon-chat.js"></script>
	<script src="assets/js/neon-custom.js"></script>
	<script src="assets/js/neon-demo.js"></script>

</body>
</html>